<!-- components/MarkdownRenderer.vue -->
<template>
  <div class="markdown-content" v-html="renderedContent" />
</template>

<script setup>
import { marked } from 'marked'
import { computed } from 'vue'

const props = defineProps({
  content: String
})

const renderedContent = computed(() => {
  return marked(props.content || '', {
    breaks: true,
    sanitize: true
  })
})
</script>